import React, { useEffect, useState } from "react";
import { getBootTime } from "./api";
import { Card } from "antd";
import { useRecoilValue } from "recoil";
import { pulseTimeState } from "../../store/config";

const BootTime: React.FC = () => {
  const pulseTime: number = useRecoilValue(pulseTimeState);

  let [serverTime, setServerTime] = useState("0");
  useEffect(() => {
    setTimeout(() => {
      getBootTime().then(time => setServerTime(time as string));
      console.log("pulse...");
    }, pulseTime);
  }, [serverTime]);

  return (
    <>
      <Card title={`当前服务器运行持续时间`} style={{ width: 300 }}>
        <p>{`${serverTime} S`}</p>
      </Card>
    </>
  );
};

export default BootTime;
